<template>
  <base-view :form-item-span="formItemSpan" :model="query" @submit="search">
    <template v-slot:params>
      <a-col :span="8">
      <a-form-model-item label="创建人员工号">
        <a-input placeholder="创建人员工号" v-model="query.empNo"/>
      </a-form-model-item>
      </a-col>
      <a-col :span="8">
      <a-form-model-item label="巡检开始时间">
        <a-date-picker placeholder="巡检开始时间" v-model="query.inspectBeginTime"/>
      </a-form-model-item>
      </a-col>
      <a-col :span="8">
      <a-form-model-item label="巡检结束时间">
        <a-date-picker placeholder="巡检结束时间" v-model="query.inspectEndTime"/>
      </a-form-model-item>
      </a-col>
      <a-col :span="24">
      <a-form-model-item class="search">
        <a-button type="primary" html-type="submit">搜索</a-button>
        <a-button style="margin-left: 8px" html-type="reset" @click="reset">重置</a-button>
      </a-form-model-item>
      </a-col>
    </template>
    <template>
      <div class="section">
        <div class="btn-group">
          <a-dropdown>
            <a-menu slot="overlay" @click="generateTask">
              <a-menu-item :key="merchantType.NATURAL_MERCHANT">正常商户</a-menu-item>
              <a-menu-item :key="merchantType.SELECTED_MERCHANT">抽检商户</a-menu-item>
              <a-menu-item :key="merchantType.LOW_TXN_MERCHANT">交易量偏低商户</a-menu-item>
              <a-menu-item :key="merchantType.RISK_MERCHANT">风险商户</a-menu-item>
              <a-menu-item :key="merchantType.NEW_MERCHANT">新入驻商户</a-menu-item>
            </a-menu>
            <a-button type="primary">
              <a-icon type="plus"/>
              <span>生成巡检任务</span>
            </a-button>
          </a-dropdown>
        </div>
        <a-table ref="table" :columns="columns" :dataSource="dataSource" rowKey="id" :loading="loading"
                 :pagination="pagination">
          <template slot="operation" slot-scope="text, record">
            <a-button type="primary" size="small" @click="notified(record)">发送巡检通知</a-button>
            <a-button type="primary" size="small" @click="view(record)">巡检任务详情</a-button>
            <a-badge
              v-hasNoPermission="['industryInfo:update', 'industryInfo:view', 'industryInfo:delete']"
              status="warning"
              text="无权限"
            ></a-badge>
          </template>
        </a-table>
      </div>
    </template>
    <i-t-m-operation ref="modalForm" modal-name="巡检任务" :currentType="currentType"></i-t-m-operation>
  </base-view>
</template>

<script>
import FormItem from '../../../../../components/common/entityView/FormItem.vue'
import ITMOperation from './ITMOperation'
export default {
  name: 'InspectTaskManage',
  provide: function () {
    return {
      merchantType: this.merchantType
    }
  },
  components: {
    FormItem,
    ITMOperation
  },
  data: function () {
    return {
      formItemSpan: 8,
      modalVisible: false,
      operationType: 'view',
      query: {
        instId: '',
        empNo: '',
        inspectBeginTime: '',
        inspectEndTime: '',
      },
      loading: false,
      pagination: {
        pageNum: 1,
        pageSize: 10,
        pageSizeOptions: ['10', '20', '30', '40', '100'],
        defaultCurrent: 1,
        defaultPageSize: 10,
        showQuickJumper: true,
        showSizeChanger: true,
        showTotal: (total, range) =>
          `显示 ${range[0]} ~ ${range[1]} 条记录，共 ${total} 条记录`
      },
      columns: [
        {
          title: '巡检任务编号',
          dataIndex: 'inspectTaskNo'
        },
        {
          title: '巡检任务描述',
          dataIndex: 'inspectTaskDesc'
        },
        {
          title: '巡检任务类型',
          /**
           * 01 正常商户巡检
           * 02 抽检商户巡检
           * 03 交易量偏低商户巡检
           * 04 风险商户巡检
           * 05 新入驻商户巡检
           */
          dataIndex: 'inspectTaskType'
        },
        {
          title: '巡检方式',
          /**
           * 00 电话巡检
           * 10 商户自助巡检
           * 20 线下现场巡检
           */
          dataIndex: 'inspectType',
          customRender (text) {
            return text ? ['电话巡检', '商户自助巡检', '线下现场巡检'][text.charAt(0)] : ''
          }
        },
        {
          title: '待巡检商户数',
          dataIndex: 'needInspectMchntNum'
        },
        {
          title: '已巡检商户数',
          dataIndex: 'inspectedMchntNum'
        },
        {
          title: '巡检开始时间',
          dataIndex: 'inspectBeginTime'
        },
        {
          title: '巡检截止时间',
          dataIndex: 'inspectEndTime'
        },
        {
          title: '巡检任务状态',
          dataIndex: 'inspectTaskStatus', // 00 ~ 02  非正式 正式 已注销
          customRender (text) {
            return ['非正式', '正式', '已注销'][+text]
          }
        },
        {
          title: '法人行名称',
          dataIndex: 'instId'
        },
        {
          title: '创建时间',
          dataIndex: 'createTime'
        },
        {
          title: '备注',
          dataIndex: 'remark'
        },
        {
          title: '操作',
          fixed: 'right',
          scopedSlots: {customRender: 'operation'}
        }
      ],

      dataSource: {},
      merchantType: {
        NATURAL_MERCHANT: 'NATURAL_MERCHANT', // 正常商户
        SELECTED_MERCHANT: 'SELECTED_MERCHANT', // 抽检商户
        LOW_TXN_MERCHANT: 'LOW_TXN_MERCHANT', // 低交易量商户
        RISK_MERCHANT: 'RISK_MERCHANT', // 风险商户
        NEW_MERCHANT: 'NEW_MERCHANT' // 新入驻商户
      },
      currentType: '', // 当前新增巡检任务商户类型
    }
  },
  methods: {
    async notified(record){
      console.log(record)
      const param = {
        instId : record.instId,
        inspectTaskNo : record.inspectTaskNo
      }
      this.$post("/admin/merParam/inspectTaskInfo/sendInspectNotice",param).then((r) =>{
        // 进件结果
        var flag = r.data.type;
        if (flag == "success") {
          this.$message.success("发送巡检通知成功");
        } else if (flag == "failure") {
        this.$message.error(r.message);
        }
        this.loading = false
      })
      /*  .catch(
        this.$message.warning("发送巡检通知失败"),
        // this.search()
      )*/
    },

    async reset(){
      this.query = {instId:this.query.instId,inspectBeginTime:"",inspectEndTime:"",}
      this.pagination.pageNum = this.pagination.defaultCurrent;
      this.pagination.pageSize = this.pagination.defaultPageSize;
      await this.search();
    },
    async search (e) {
      e && e.preventDefault && e.preventDefault()
      try {
        const res = await this.$get('/admin/merParam/inspectTaskInfo/list', {
          empNo: this.query.empNo,
          instId:this.query.instId,
          inspectBeginTime: this.query.inspectBeginTime,
          inspectEndTime: this.query.inspectEndTime,
          pageNum: this.pagination.pageNum,
          pageSize: this.pagination.pageSize
        })
        this.dataSource = res.data.rows
        this.$set(this.pagination, 'total', +res.data.total)
      } catch (e) {
        console.error(e)
      }
    },
    generateTask (e) {
      this.currentType = e.key;
      this.openModal('add')
    },
    openModal (type = 'add', beanInfo) {
      this.$refs.modalForm.openModal(type, beanInfo)
    },
    async submit () {
      const res = await this.$refs.modalForm.submit()
      if (res) {
        this.modalVisible = false
        this.pagination.defaultCurrent = 1
        await this.search()
      }
    },
    edit (item) {
      this.openModal('edit', item)
    },
    view (item) {
      console.log(item)
      this.openModal('view', item)
    },
  }
}
</script>

<style scoped>
.page {
  width: 100%;
}

.section {
  background: #fff;
}

.form {
  text-align: center;
}
.select {
  width: 180px;
}

.btn-group {
  margin-bottom: 20px;
}
</style>
